<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul>
    <li>亲戚
        <ul>
            <li>刘邦</li><li>刘秀</li><li>朱元璋</li>
        </ul>
    </li>
    <li>同事
        <ul>
            <li>马云</li><li>马化腾</li><li>李彦宏</li>
        </ul>
    </li>
    <li>未婚妻
        <ul>
            <li>阴丽华</li><li>孙尚香</li><li>马皇后</li>
        </ul>
    </li>
</ul>

<script src="jquery.min.js"></script>
<script>
    //得到第二层的所有ul并让其隐藏
    $("li>ul").hide();
    //选择第一层的li并添加点击事件
    $("body>ul>li").click(function () {
        console.log($(this).text());
        //$(this) 代表事件源, 触发事件的元素
        //得到点击的li  里面的ul  children()获取子元素
        $(this).children().toggle();
    })
</script>
</body>
</html>